<template>
  <ve-wordcloud
    :data="chartData"
    height="100%"
    :settings="chartSettings"
  ></ve-wordcloud>
</template>

<script>
import CommonDataMixin from "@/mixins/CommonDataMixin";

export default {
  mixins: [CommonDataMixin],
  watch: {
    wordCloud() {
      const data  = []
      this.wordCloud.forEach(element => {
        data.push({
          name: element.word,
          value: element.count
        })
      });
      this.chartData = {
        columns: ["name", "value"],
        rows: data,
      };
    },
  },
  data() {
    return {
      chartData: {},
      chartSettings: {
        color: [
          "rgba(97,216,0,.7)",
          "rgba(204,178,26,.7)",
          "rgba(245,166,35,.7)",
          "rgba(156,13,113,.7)",
        ],
      },
    };
  },
};
</script>

<style>
</style>